<template>
	<view class="appTab">
		<view class="appTab_item" v-for="(item,index) in list" :key="index" @click="changeFun(index)">
			<image v-if="index === current" :src="item.selectedIconPath" mode=""></image>
			<image v-if="index !== current" :src="item.iconPath" mode=""></image>
			<view class="appTab_item_text" :style="index === current?'color:#FF6F12;':'color:#BBBBBB;'">
				{{item.text}}
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "appTab",
		props: {
			current: {
				type: Number,
				default: 0
			}
		},
		data() {
			return {
				list: [
					// {
					// 	iconPath: "../../static/components/home.png",
					// 	selectedIconPath: "../../static/components/ShowHome.gif",
					// 	text: '首页',
					// 	Page: '/pages/home/home'
					// }, {
					// 	iconPath: "../../static/components/ProductClassification.png",
					// 	selectedIconPath: "../../static/components/ShowProductClassification.gif",
					// 	text: '分类',
					// 	Page: '/pages/ProductClassification/ProductClassification'
					// }, {
					// 	iconPath: "../../static/components/car.png",
					// 	selectedIconPath: "../../static/components/ShowCar.gif",
					// 	text: '购物车',
					// 	Page: '/pages/car/car'
					// },
					{
						iconPath: "../../static/components/member.png",
						selectedIconPath: "../../static/components/ShowMember.gif",
						text: '我的',
						Page: '/pages/member/member'
					}
				]
			};
		},
		onshow() {},
		methods: {
			changeFun(e) {
				uni.switchTab({
					url: this.list[e].Page
				})



				// uni.reLaunch({
				// 	url: this.list[e].Page
				// })
			}
		}
	}
</script>

<style lang="scss">
	.appTab {
		width: 100%;
		height: 100rpx;
		// background-color: #fff;
		display: flex;
		justify-content: space-around;
		padding-top: 8rpx;


		.appTab_item {
			width: 25%;
			height: 100%;
			display: flex;
			flex-direction: column;
			align-items: center;

			image {
				width: 50rpx;
				height: 50rpx;
			}

			.appTab_item_text {
				font-size: 26rpx;
			}
		}
	}
</style>